<!doctype html>
<html>

  <head>
    <meta charset="UTF-8">
    <title>退货历史</title>
    <meta name="viewport" content="width=device-width,initial-scale=1,minimum-scale=1,maximum-scale=1,user-scalable=no" />
    <link href="../css/mui.min.css" rel="stylesheet" />
    <link rel="stylesheet" href="../css/1px.css" />
    <link href="../css/mui.picker.css" rel="stylesheet" />
    <link rel="stylesheet" href="../css/mui.poppicker.css" />
    <link rel="stylesheet" href="../css/mui.dtpicker.css" />
  </head>
  <style>
    html {
      font-family: Roboto, Arial, "Noto Sans CJK SC", "Noto Sans CJK TC", "Pingfang SC", "Microsoft Yahei", "WenQuanYi Micro Hei", sans-serif;
    }
    
    body {
      overflow-x: hidden;
      background-color: #fff !important;
    }
    
    .mui-content {
      background-color: #fff;
    }
    
    .flex {
      display: flex;
    }
    /**/
    
    .mui-scroll-wrapper {
      top: 40px;
    }
    /**/
    
    .select-all {
      margin-top: 10px;
      text-indent: 5px;
    }
    
    .select {
      width: 80%;
      margin-left: 5%;
      border: 1px solid #C0C0C0;
      border-radius: 3px;
      line-height: 24px;
      font-size: 14px;
      color: #ACACB4;
      position: relative;
    }
    
    .start-time,
    .end-time {
      border: 1px solid #C0C0C0;
      border-radius: 3px;
      line-height: 24px;
      font-size: 14px;
      color: #ACACB4;
      position: relative;
      width: 40%;
    }
    
    .start-time {
      margin-left: 5%;
    }
    
    .select-time {
      flex: 5;
    }
    
    .mui-icon-arrowdown {
      font-size: 14px;
      position: absolute;
      right: 5px;
      top: 5px;
    }
    /**/
    
    .list-content {
      padding-bottom: 10px;
    }
    
    .list-content:after {
      height: 0;
      content: '';
      clear: both;
      display: block;
    }
    
    .apply-bill {
      float: left;
      width: 48%;
      margin-top: 10px;
      margin-left: 1.3%;
      height: 90px;
      font-size: 13px;
      line-height: 22px;
      background-color: #fff;
      padding: 4px 0;
    }
    
    .bill-box {
      text-indent: 5px;
      width: 92%;
      margin-left: 4%;
      position: relative;
      border: 1px dashed #ccc;
      border-radius: 5px;
    }
    
    .edit-icon {
      position: absolute;
      bottom: 2px;
      right: 2px;
    }
    /*加载*/
    
    .mui-pull-bottom-pocket {
      visibility: visible;
    }
    
    .mui-pull-bottom-pocket .mui-pull-loading {
      visibility: visible;
    }
  </style>

  <body>
    <!--主体-->
    <div class="mui-content">
      <div class="flex select-all">
        <div class="select-time">
          <div class="flex">
            <div class="start-time">
              <!--2017-12-1-->
            </div>
            <span style="display: inline-flex;font-size:13px;margin-right: 2%;">至</span>
            <div class="end-time">
              <!--2017-12-22-->
            </div>
          </div>
        </div>
      </div>
      <div id="refreshContainer" class="mui-scroll-wrapper">
        <div class="mui-scroll">
          <div class="list-content">

          </div>
          <!--加载中-->
          <div class="mui-pull-bottom-pocket">
            <div class="mui-pull">
            </div>
          </div>
          <!--加载中-->
        </div>
      </div>
      <script id="applyList" type="text/html">
        <% for(var i=0;i<list.length;i++){ %>
        <div class="apply-bill" data-id=" <%=list[i].refundId %>" data-status="<%=list[i].refundRecivedStatus%>">
          <div class="bill-box">
            <div class="apply-id">
              <%=list[i].refundId %>
            </div>
            <div class="goods-num">货品数量：
              <%=list[i].refundAmount%>
            </div>
            <div class="goods-style">货品款式：
              <%=list[i].refundStyle%>
            </div>
            <div class="apply-status">状态：
              <%if(list[i].refundRecivedStatus===0){%> 未提交
              <%}else if(list[i].refundRecivedStatus===1) {%> 总仓库待收货
              <%} else {%> 总仓库已收货
              <%}%>
            </div>
            <%if(list[i].refundRecivedStatus ===0){%>
            <img class="edit-icon" src="../images/edit.png" alt="" />
            <%}%>
          </div>
        </div>
        <%}%>
      </script>
    </div>
    <!---->
    <script src="../config.js"></script>
    <script src="../js/template-native.js" type="text/javascript" charset="utf-8"></script>
    <script src="../js/mui.min.js"></script>
    <script src="../js/mui.picker.js"></script>
    <script src="../js/mui.poppicker.js"></script>
    <script type="text/javascript" src="../js/mui.dtpicker.js"></script>
    <script type="text/javascript">
      (function($) {
        $.init({
          beforeback: function() {
            if(type === 1) {
              return true
            } else if(type === 2) {
              var allPage = plus.webview.all()
              var nowPage = plus.webview.getWebviewById('index')
              for(var i = 0; i < allPage.length; i++) {
                if(allPage[i].getURL() !== nowPage.getURL()) {
                  plus.webview.close(allPage[i]);
                }
              }
            }
          }
        })
        $.plusReady(function() {
          receiveParams()
          getApply()
        })
        $.ready(function() {
          setPicker()
          bindEvent()
        })
        //
        window.addEventListener('changeList', function(e) {
          pageNo = 1
          var fromTime = new Date().format('yyyy-MM') + '-01'
          toTime = new Date().format('yyyy-MM-dd')
          document.querySelector(".start-time").innerText = fromTime
          document.querySelector(".end-time").innerText = toTime
          refundList = []
          mui('.mui-scroll-wrapper').scroll().scrollTo(0, 0, 100)
          getApply()
        })
        //滚动
        $('.mui-scroll-wrapper').scroll({
          scrollY: true,
          bounce: true,
          deceleration: 0.0005 //flick 减速系数，系数越大，滚动速度越慢，滚动距离越小，默认值0.0006，
        });
        var fromTime = new Date().format('yyyy-MM') + '-01',
          toTime = new Date().format('yyyy-MM-dd'),
          storeId = '',
          pageNo = 1,
          pageCount = 10,
          refundList = [],
          isLoading = false,
          pageTatol = 0,
          type = ''
        document.querySelector(".start-time").innerText = fromTime
        document.querySelector(".end-time").innerText = toTime
        //设置加载状态
        function setLoading(type) {
          switch(type) {
            case 1:
              document.querySelector(".mui-pull").innerHTML = '<div class="mui-pull-loading mui-icon mui-spinner"></div>\
						<div class="mui-pull-caption">正在加载</div>'
              break
            case 2:
              document.querySelector(".mui-pull").innerHTML = '<div class="mui-pull-caption">没有更多</div>'
              break
            case 0:
              document.querySelector(".mui-pull").innerHTML = ''
              break
          }

        }

        function setPicker() {
          //起始时间
          var options = {
            'type': 'date'
          }
          var startTimePicker = new $.DtPicker(options)
          var startTime = document.querySelector(".start-time")
          startTime.addEventListener('tap', function() {
            startTimePicker.show(function(item) {
              startTime.innerText = item.text
              fromTime = item.text
              pageNo = 1
              refundList = []
              mui('.mui-scroll-wrapper').scroll().scrollTo(0, 0, 100)
              getApply()
            })
          })
          //结束时间
          var endTimePicker = new $.DtPicker({
            'type': 'date'
          })
          var endTime = document.querySelector(".end-time")
          endTime.addEventListener('tap', function() {
            endTimePicker.show(function(item) {
              endTime.innerText = item.text
              toTime = item.text
              pageNo = 1
              refundList = []
              mui('.mui-scroll-wrapper').scroll().scrollTo(0, 0, 100)
              getApply()
            })
          })
        }
        //接收数据
        function receiveParams() {
          var self = plus.webview.currentWebview();
          currentShopObj = self.currentShopObj;
          type = self.type
          storeId = self.currentShopObj.storeId
        }
        // 绑定事件
        function bindEvent() {
          //滚动监听
          document.querySelector('.mui-scroll-wrapper').addEventListener('scrollend', function(e) {
            if(e.detail.y <= e.detail.maxScrollY) {
              if(isLoading === false) {
                if(++pageNo <= pageTatol) {
                  getApply()
                } else {
                  setLoading(2)
                }
              }
            }
          });
          $('.list-content').on('tap', '.apply-bill', function() {
            var elRefundId = this.getAttribute('data-id')
            var status = this.getAttribute('data-status') - 0
            //获取点击单数据
            config.ajax({
              type: 'post',
              url: config.basePath + '/refund/checkrefundgoods',
              headers: {
                'Content-Type': 'application/json'
              },
              data: {
                refundId: elRefundId
              },
              success: function(res) {
                if(res.result === 1) {
                  var refundGoodsList = res.goodsList
                  var titleText = currentShopObj.storeName + '-退货'
                  if(status === 0) {
                    $.openWindow({
                      url: 'withdraw2.html',
                      id: 'withdraw2',
                      styles: {
                        top: 0, //新页面顶部位置
                        bottom: 0, //新页面底部位置
                        titleNView: {
                          titleText: titleText,
                          titleColor: "#FFFFFF",
                          titleSize: "17px",
                          backgroundColor: "#FF6800",
                          autoBackButton: true,
                          buttons: [{
                            float: "right",
                            fontSize: "18px",
                            fontSrc: "_www/fonts/iconfont.ttf", //wap2app内置字体文件
                            text: "\ue602",
                            onclick: function() {
                              var allPage = plus.webview.all()
                              var nowPage = plus.webview.getWebviewById('index')
                              for(var i = 0; i < allPage.length; i++) {
                                if(allPage[i].getURL() !== nowPage.getURL()) {
                                  plus.webview.close(allPage[i]);
                                }
                              }
                            }
                          }],
                          splitLine: {
                            color: "#CCCCCC",
                            height: "1px"
                          }
                        }
                      },
                      extras: {
                        currentShopObj: currentShopObj,
                        refundGoodsList: refundGoodsList,
                        refundId: elRefundId
                      },
                    })
                  } else {
                    $.openWindow({
                      url: 'withdrawDetail.html',
                      id: 'withdrawDetail',
                      styles: {
                        top: 0, //新页面顶部位置
                        bottom: 0, //新页面底部位置
                        titleNView: {
                          titleText: titleText,
                          titleColor: "#FFFFFF",
                          titleSize: "17px",
                          backgroundColor: "#FF6800",
                          autoBackButton: true,
                          buttons: [{
                            float: "right",
                            fontSize: "18px",
                            fontSrc: "_www/fonts/iconfont.ttf", //wap2app内置字体文件
                            text: "\ue602",
                            onclick: function() {
                              var topPage = plus.webview.getWebviewById('withdraw')
                              topPage && topPage.close('none')
                              var otherPage = plus.webview.getWebviewById('withdraw2')
                              otherPage && otherPage.close('none')
                              var parentPage = plus.webview.getWebviewById('withdrawList')
                              parentPage && parentPage.close('none')
                              var nowPage = plus.webview.getWebviewById('withdrawDetail')
                              nowPage && nowPage.close()
                            }
                          }],
                          splitLine: {
                            color: "#CCCCCC",
                            height: "1px"
                          }
                        }
                      },
                      extras: {
                        currentShopObj: currentShopObj,
                        refundGoodsList: refundGoodsList,
                        refundId: elRefundId,
                        status: status,
                        linkMan:res.refund.linkMan
                      },
                    })
                  }
                }
              }
            })

          })
        }
        //获取数据
        function getApply() {
          isLoading = true
          setLoading(1)
          if(fromTime && toTime) {
            if(new Date(fromTime).getTime() > new Date(toTime).getTime()) {
              var startTime = toTime
              var endTime = fromTime
            } else {
              var startTime = fromTime
              var endTime = toTime
            }
          }
          $.ajax({
            type: "post",
            url: config.basePath + "/refund/checkrefund",
            async: true,
            headers: {
              'Content-Type': 'application/json'
            },
            data: {
              fromTime: new Date(startTime + ' 00:00:00').getTime(),
              toTime: new Date(endTime + ' 23:59:59').getTime(),
              storeId: storeId,
              pageNo: pageNo,
              pageCount: 10
            },
            success: function(res) {
              if(res.result === 1) {
                pageTatol = res.refunds.pageTatol
                for(var k = 0; k < res.refunds.data.length; k++) {
                  refundList.push(res.refunds.data[k])
                }
                setPage()
                isLoading = false
                setLoading(0)
              } else {
                if(pageNo === 1) {
                  var html = template('applyList', {
                    list: [],
                  })
                  $('.list-content')[0].innerHTML = html
                }
                isLoading = false
                setLoading(0)
              }
            }
          });
        }

        function setPage() {
          var html = template('applyList', {
            list: refundList,
          })
          $('.list-content')[0].innerHTML = html
        }
      })(mui)
    </script>
  </body>

</html>